<template>
    <pageTabelLayout>
        <template #pageHeader>
            <div class="search-form divClass" v-if="headerShow" style="margin-top:20px">
                <div>
                    <a-form size="small" :model="pageData" layout="inline">
                        <a-form-item label-col-flex="80px" label="当班日期">
                            <a-date-picker  popup-container="html"  class="bacClass" v-model="pageData.beginTime" />至<a-date-picker  popup-container="html"  class="bacClass"
                                v-model="pageData.endTime" />
                        </a-form-item>
                        <a-form-item label-col-flex="80px" label="车间名称">
                            <a-input allow-clear :style="{ width: '200px' }" class="bacClass" placeholder=""
                                v-model="pageData.workshop" @press-enter="huiche" />
                        </a-form-item>
                    </a-form>
                </div>
                <div class="my-tool-bar">
                    <Toolbar style="float:right" :items="['查询', '导出']" @select="selectHandler" @export="exports">
                    </Toolbar>
                </div>
            </div>
            <div class="my-divisders">
                <a-divider orientation="center">
                    <icon-double-up v-if="headerShow" @click="headerShow = false" :strokeWidth="2" :size="18" />
                    <icon-double-down v-else @click="headerShow = true" :strokeWidth="2" :size="18" />
                </a-divider>
            </div>
        </template>
        <template #pageTabel>
            <a-tabs   :lazy-load="true" :justify="true" default-active-key="1" @change="handoff">
                <a-tab-pane title="回修查询" key="1">
                    <a-spin :loading="pageData.pageLoading" tip="加载中" dot style="height:100%;width: 100%;z-index:999 ;">
                        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady"
                            style="height:95%;" :localeText="localeText1" :defaultColDef="defaultColDef"
                            class='ag-theme-alpine' :rowData="table.dataList" :columnDefs="tc">
                        </AgGridVuesCopys>
                    </a-spin>
                </a-tab-pane>
                <a-tab-pane title="批色返定查询" key="2">
                    <a-spin :loading="pageData.pageLoading" tip="加载中" dot style="height:100%;width: 100%;z-index:999 ;">
                        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady2"
                            style="height:95%;" :localeText="localeText1" :defaultColDef="defaultColDef"
                            class='ag-theme-alpine' :rowData="table.dataList" :columnDefs="tc2">
                        </AgGridVuesCopys>
                    </a-spin>
                </a-tab-pane>
                <a-tab-pane title="定型加色查询" key="3">
                    <a-spin :loading="pageData.pageLoading" tip="加载中" dot style="height:100%;width: 100%;z-index:999 ;">
                        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady3"
                            style="height:95%;" :localeText="localeText1" :defaultColDef="defaultColDef"
                            class='ag-theme-alpine' :rowData="table.dataList" :columnDefs="tc3">
                        </AgGridVuesCopys>
                    </a-spin>
                </a-tab-pane>
                <a-tab-pane title="预缩湿定成品查询" key="4">
                    <a-spin :loading="pageData.pageLoading" tip="加载中" dot style="height:100%;width: 100%;z-index:999 ;">
                        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady4"
                            style="height:95%;" :localeText="localeText1" :defaultColDef="defaultColDef"
                            class='ag-theme-alpine' :rowData="table.dataList" :columnDefs="tc4">
                        </AgGridVuesCopys>
                    </a-spin>
                </a-tab-pane>
            </a-tabs>
        </template>
        <paginationCopys :page-size-options="pagingList1" :total="total" show-total show-jumper show-page-size
            @change="PageSize" @page-size-change="change1" style="justify-content: center;" :page-size="size"
            :current="page" />

    </pageTabelLayout>
</template>
<script lang="ts" >
import { pagingList } from "@/api/paging";
import { post } from '@/api/http'
import { useTable, useRowKey, useTableColumn, usePagination, useRowSelection } from '@/hooks/table';
import emitter from "@/hooks/useEventBus";
import { ref, reactive, onMounted, toRefs, watch } from 'vue'
import Toolbar from '@/components/Toolbar.vue';
import { Form, Message, Modal } from '@arco-design/web-vue';
import { FormInstance } from '@arco-design/web-vue/es/form';
import { baseURL } from '../../../../api/axios.config'
import axios from "axios";
import filedownload from 'js-file-download'
import PageTabelLayout from '@/components/pageTabelLayout.vue';

import { localeText } from '@/api/aggridZw'

interface BrandInfo {
    "id": any,
    "deleteState": any,
}

export default {
    name: "Production2",
    setup() {
        const total = ref(0);
        const page = ref(1);
        const size = ref(10);
        const headerShow = ref<boolean>(true)
        //分页
        function PageSize(val: any) {
            page.value = val
            if (id.value == 1) {
                doRefresh();
            } else if (id.value == 2) {
                doRefresh2();
            } else if (id.value == 3) {
                doRefresh3();
            } else if (id.value == 4) {
                doRefresh4();
            }
        }
        function change1(val: any) {
            size.value = val
            if (id.value == 1) {
                doRefresh();
            } else if (id.value == 2) {
                doRefresh2();
            } else if (id.value == 3) {
                doRefresh3();
            } else if (id.value == 4) {
                doRefresh4();
            }
        }
        let id = ref(1);
        const handoff = (key: any) => {
            id.value = key
            total.value = 0
            page.value = 1
            size.value = 10
            selectHandler()
        }
        //查询方法 回修
        function doRefresh() {
            pageData.pageLoading = true
            post({
                url: "dwWorkShop/hzDailyOne/getRepairDaily",
                data: {
                    "page": page.value,
                    "size": size.value,
                    beginTime: pageData.beginTime,
                    endTime: pageData.endTime,
                    workshop: pageData.workshop
                },
            })
                .then(({ data, code }: any) => {
                    if (code === 200) {
                        table.handleSuccess(data.data);
                        gridOption.value.setRowData(data.data);
                        total.value = data.total;
                    }
                })
                .catch(console.log).finally(() => {
                    pageData.pageLoading = false
                })
        }
        //查询方法 定型加色
        function doRefresh2() {
            pageData.pageLoading = true
            post({
                url: "dwWorkShop/hzDailyOne/getRepairDaily",
                data: {
                    "page": page.value,
                    "size": size.value,
                    beginTime: pageData.beginTime,
                    endTime: pageData.endTime,
                    workshop: pageData.workshop
                },
            })
                .then(({ data, code }: any) => {
                    if (code === 200) {
                        table.handleSuccess(data.data);
                        gridOption2.value.setRowData(data.data);
                        total.value = data.total;
                    }
                })
                .catch(console.log).finally(() => {
                    pageData.pageLoading = false
                })
        }
        //查询方法 定型加色
        function doRefresh3() {
            pageData.pageLoading = true
            post({
                url: "dwWorkShop/hzDailyOne/getRepairDaily",
                data: {
                    "page": page.value,
                    "size": size.value,
                    beginTime: pageData.beginTime,
                    endTime: pageData.endTime,
                    workshop: pageData.workshop
                },
            })
                .then(({ data, code }: any) => {
                    if (code === 200) {
                        table.handleSuccess(data.data);
                        gridOption3.value.setRowData(data.data);
                        total.value = data.total;
                    }
                })
                .catch(console.log).finally(() => {
                    pageData.pageLoading = false
                })
        }
        //查询方法 批色返定
        function doRefresh4() {
            pageData.pageLoading = true
            post({
                url: "dwWorkShop/hzDailyOne/getPreshrunkDaily",
                data: {
                    "page": page.value,
                    "size": size.value,
                    beginTime: pageData.beginTime,
                    endTime: pageData.endTime,
                    workshop: pageData.workshop
                },
            })
                .then(({ data, code }: any) => {
                    if (code === 200) {
                        table.handleSuccess(data.data);
                        gridOption4.value.setRowData(data.data);
                        total.value = data.total;
                    }
                })
                .catch(console.log).finally(() => {
                    pageData.pageLoading = false
                })
        }


        const pagination = usePagination(doRefresh);
        const table = useTable();
        //回修查询
        const tableColumns = useTableColumn([
            {
                title: "工序",
                key: "process",
                dataIndex: "process",
                width: 150
            },
            {
                title: "日期",
                key: "classTime",
                dataIndex: "classTime",
                width: 150
            },
            {
                title: "流转卡号",
                key: "flowCardCode",
                dataIndex: "flowCardCode",
                width: 150
            },
            {
                title: "布号",
                key: "greyCode",
                dataIndex: "greyCode",
                width: 150
            },
            {
                title: "品名",
                key: "productName",
                dataIndex: "productName",
                width: 150
            },
            {
                title: "色号",
                key: "colorCode",
                dataIndex: "colorCode",
                width: 150
            },
            {
                title: "色称",
                key: "colorName",
                dataIndex: "colorName",
                width: 150
            },
            {
                title: "匹数",
                key: "canUseHouseNum",
                dataIndex: "canUseHouseNum",
                width: 150
            },
            {
                title: "重量",
                key: "canUseWeight",
                dataIndex: "canUseWeight",
                width: 150
            },
            {
                title: "责任部门",
                key: "dutyDep",
                dataIndex: "dutyDep",
                width: 150
            },
            {
                title: "回修原因",
                key: "processCause",
                dataIndex: "processCause",
                width: 150
            },
            {
                title: "班组",
                key: "workshop",
                dataIndex: "workshop",
                width: 150
            }
        ]);

        //批色按定查询
        const tableColumns2 = useTableColumn([
            {
                title: "工序",
                key: "process",
                dataIndex: "process",
                width: 150
            },
            {
                title: "日期",
                key: "classTime",
                dataIndex: "classTime",
                width: 150
            },
            {
                title: "流转卡号",
                key: "flowCardCode",
                dataIndex: "flowCardCode",
                width: 150
            },
            {
                title: "布号",
                key: "greyCode",
                dataIndex: "greyCode",
                width: 150
            },
            {
                title: "品名",
                key: "productName",
                dataIndex: "productName",
                width: 150
            },
            {
                title: "色号",
                key: "colorCode",
                dataIndex: "colorCode",
                width: 150
            },
            {
                title: "色称",
                key: "colorName",
                dataIndex: "colorName",
                width: 150
            },
            {
                title: "匹数",
                key: "canUseHouseNum",
                dataIndex: "canUseHouseNum",
                width: 150
            },
            {
                title: "重量",
                key: "canUseWeight",
                dataIndex: "canUseWeight",
                width: 150
            },
            {
                title: "责任部门",
                key: "dutyDep",
                dataIndex: "dutyDep",
                width: 150
            },
            {
                title: "回修原因",
                key: "processCause",
                dataIndex: "processCause",
                width: 150
            },
            {
                title: "班组",
                key: "workshop",
                dataIndex: "workshop",
                width: 150
            },
            {
                title: "结束员工",
                key: "finishStaff",
                dataIndex: "finishStaff",
                width: 150
            }
        ]);

        //定型加色查询
        const tableColumns3 = useTableColumn([
            {
                title: "工序",
                key: "process",
                dataIndex: "process",
                width: 150
            },
            {
                title: "日期",
                key: "classTime",
                dataIndex: "classTime",
                width: 150
            },
            {
                title: "流转卡号",
                key: "flowCardCode",
                dataIndex: "flowCardCode",
                width: 150
            },
            {
                title: "布号",
                key: "greyCode",
                dataIndex: "greyCode",
                width: 150
            },
            {
                title: "品名",
                key: "productName",
                dataIndex: "productName",
                width: 150
            },
            {
                title: "色号",
                key: "colorCode",
                dataIndex: "colorCode",
                width: 150
            },
            {
                title: "色称",
                key: "colorName",
                dataIndex: "colorName",
                width: 150
            },
            {
                title: "匹数",
                key: "canUseHouseNum",
                dataIndex: "canUseHouseNum",
                width: 150
            },
            {
                title: "重量",
                key: "canUseWeight",
                dataIndex: "canUseWeight",
                width: 150
            },
            {
                title: "设备编号",
                key: "device",
                dataIndex: "device",
                width: 150
            },
            {
                title: "班组",
                key: "workshop",
                dataIndex: "workshop",
                width: 150
            },
            {
                title: "结束员工",
                key: "finishStaff",
                dataIndex: "finishStaff",
                width: 150
            },
            {
                title: "对色师傅",
                key: "affirmColourName",
                dataIndex: "affirmColourName",
                width: 150
            }
        ]);

        //预缩湿定成品查询
        const tableColumns4 = useTableColumn([
            {
                title: "工序",
                key: "process",
                dataIndex: "process",
                width: 150
            },
            {
                title: "日期",
                key: "classTime",
                dataIndex: "classTime",
                width: 150
            },
            {
                title: "流转卡号",
                key: "flowCardCode",
                dataIndex: "flowCardCode",
                width: 150
            },
            {
                title: "布号",
                key: "greyCode",
                dataIndex: "greyCode",
                width: 150
            },
            {
                title: "品名",
                key: "productName",
                dataIndex: "productName",
                width: 150
            },
            {
                title: "色号",
                key: "colorCode",
                dataIndex: "colorCode",
                width: 150
            },
            {
                title: "色称",
                key: "colorName",
                dataIndex: "colorName",
                width: 150
            },
            {
                title: "匹数",
                key: "canUseHouseNum",
                dataIndex: "canUseHouseNum",
                width: 150
            },
            {
                title: "重量",
                key: "canUseWeight",
                dataIndex: "canUseWeight",
                width: 150
            },
            {
                title: "责任部门",
                key: "dutyDep",
                dataIndex: "dutyDep",
                width: 150
            },
            {
                title: "回修原因",
                key: "processCause",
                dataIndex: "processCause",
                width: 150
            },
            {
                title: "班组",
                key: "workshop",
                dataIndex: "workshop",
                width: 150
            },
            {
                title: "结束员工",
                key: "finishStaff",
                dataIndex: "finishStaff",
                width: 150
            }
        ]);


        let tc: any[] = tableColumns.map((o) => {
            let obj = {
                headerName: o.title,
                field: o.key,
                pinned: o['fixed'],
            }
            return obj
        })
        let tc2: any[] = tableColumns2.map((o) => {
            let obj = {
                headerName: o.title,
                field: o.key,
                pinned: o['fixed'],
            }
            return obj
        })
        let tc3: any[] = tableColumns3.map((o) => {
            let obj = {
                headerName: o.title,
                field: o.key,
                pinned: o['fixed'],
            }
            return obj
        })
        let tc4: any[] = tableColumns4.map((o) => {
            let obj = {
                headerName: o.title,
                field: o.key,
                pinned: o['fixed'],
            }
            return obj
        })

        let a = [{
            showRowGroup: 'hide_def',
            "headerName": "",
            "checkboxSelection": true,
            "headerCheckboxSelection": true,
            "pinned": "left",
            "width": 50,
            resizable: false,
            filter: false,
            sortable: false,
            minWidth: 50,
            maxWidth: 50,
            lockPosition: "left",
        }]
        tc = a.concat(tc)
        tc2 = a.concat(tc2)
        tc3 = a.concat(tc3)
        tc4 = a.concat(tc4)

        const dataForm = reactive<BrandInfo>({
            "id": null,
            "deleteState": 0,
        })
        const pageData = reactive<{
            nameList: [],
            pageLoading: boolean,
            beginTime: any
            endTime: any
            workshop: any
        }>({
            nameList: [],
            pageLoading: false,
            beginTime: "",
            endTime: "",
            workshop: "",
        });

        onMounted(() => {
            doRefresh();
            // 切换tap到本页面执行的方法
            emitter.on("Production2", () => {
                if (id.value == 1) {
                    doRefresh();
                } else if (id.value == 2) {
                    doRefresh2();
                } else if (id.value == 3) {
                    doRefresh3();
                } else if (id.value == 4) {
                    doRefresh4();
                }
            });
        });

        //查询按钮
        const selectHandler = () => {
            page.value = 1
            if (id.value == 1) {
                doRefresh();
            } else if (id.value == 2) {
                doRefresh2();
            } else if (id.value == 3) {
                doRefresh3();
            } else if (id.value == 4) {
                doRefresh4();
            }
        }

        // 表格准备事件
        const gridOption = ref()
        const gridReady = (params: any) => {
            gridOption.value = params.api
        }
        const gridOption2 = ref()
        const gridReady2 = (params: any) => {
            gridOption2.value = params.api
        }
        const gridOption3 = ref()
        const gridReady3 = (params: any) => {
            gridOption3.value = params.api
        }
        const gridOption4 = ref()
        const gridReady4 = (params: any) => {
            gridOption4.value = params.api
        }


        const pagingList1: any = ref(pagingList)
        const handleChange = (_data: any) => {
            table.handleSuccess(_data);
        }

        const defaultColDef = {
            sortable: true,
            resizable: true,
            filter: true,
        }
        //表格中文显示
        const localeText1: any = ref(localeText)

        //回车模糊查询
        const huiche = () => {
            if (id.value == 1) {
                doRefresh();
            } else if (id.value == 2) {
                doRefresh2();
            } else if (id.value == 3) {
                doRefresh3();
            } else if (id.value == 4) {
                doRefresh4();
            }
        }

        //导出
        const exports = () => {
            if (gridOption.value.getSelectedRows().length === 0 && gridOption2.value.getSelectedRows().length === 0 && gridOption3.value.getSelectedRows().length === 0 && gridOption4.value.getSelectedRows().length === 0) {
                Message.error('请先勾选数据');
                return
            } else if (id.value == 1) {
                let idList: any = []
                gridOption.value.getSelectedRows().forEach(function (o: any) {
                    idList.push(o['id'])
                })
                //将表头拼接出来
                let head = "<th>工序</th><th>日期</th><th>流转卡号</th><th>布号</th><th>品名</th><th>色号</th><th>色称</th><th>匹数</th><th>重量</th><th>责任部门</th><th>回修原因</th><th>班组</th>"
                //拿到当前表格数据与勾选的行做筛选
                let nowRow = table.dataList.filter(function (o) {
                    return (gridOption.value.getSelectedRows().map((o: any) => { return o.id })).indexOf(o["id"]) !== -1;
                })
                let body = "";
                nowRow.forEach(function (o) {
                    body += "<tr><td>" + o["process"] + "</td>";
                    body += "<td>" + o["classTime"] + "</td>";
                    body += "<td>" + o["flowCardCode"] + "</td>";
                    body += "<td>" + o["greyCode"] + "</td>";
                    body += "<td>" + o["productName"] + "</td>";
                    body += "<td>" + o["colorCode"] + "</td>";
                    body += "<td>" + o["colorName"] + "</td>";
                    body += "<td>" + o["canUseHouseNum"] + "</td>";
                    body += "<td>" + o["canUseWeight"] + "</td>";
                    body += "<td>" + o["dutyDep"] + "</td>";
                    body += "<td>" + o["processCause"] + "</td>";
                    body += "<td>" + o["workshop"] + "</td>";
                    body += "</tr>";
                })
                tableToXlsx(head, '回修查询', body)
            } else if (id.value == 2) {
                let idList: any = []
                gridOption.value.getSelectedRows().forEach(function (o: any) {
                    idList.push(o['id'])
                })
                //将表头拼接出来
                let head = "<th>工序</th><th>日期</th><th>流转卡号</th><th>布号</th><th>品名</th><th>色号</th><th>色称</th><th>匹数</th><th>重量</th><th>责任部门</th><th>回修原因</th><th>班组</th><th>结束员工</th>"
                //拿到当前表格数据与勾选的行做筛选
                let nowRow = table.dataList.filter(function (o) {
                    return (gridOption.value.getSelectedRows().map((o: any) => { return o.id })).indexOf(o["id"]) !== -1;
                })
                let body = "";
                nowRow.forEach(function (o) {
                    body += "<tr><td>" + o["process"] + "</td>";
                    body += "<td>" + o["classTime"] + "</td>";
                    body += "<td>" + o["flowCardCode"] + "</td>";
                    body += "<td>" + o["greyCode"] + "</td>";
                    body += "<td>" + o["productName"] + "</td>";
                    body += "<td>" + o["colorCode"] + "</td>";
                    body += "<td>" + o["colorName"] + "</td>";
                    body += "<td>" + o["canUseHouseNum"] + "</td>";
                    body += "<td>" + o["canUseWeight"] + "</td>";
                    body += "<td>" + o["dutyDep"] + "</td>";
                    body += "<td>" + o["processCause"] + "</td>";
                    body += "<td>" + o["workshop"] + "</td>";
                    body += "<td>" + o["finishStaff"] + "</td>";
                    body += "</tr>";
                })
                tableToXlsx(head, '批色按定查询', body)
            } else if (id.value == 3) {
                let idList: any = []
                gridOption.value.getSelectedRows().forEach(function (o: any) {
                    idList.push(o['id'])
                })
                //将表头拼接出来
                let head = "<th>工序</th><th>日期</th><th>流转卡号</th><th>布号</th><th>品名</th><th>色号</th><th>色称</th><th>匹数</th><th>重量</th><th>设备编号</th><th>班组</th><th>结束员工</th><th>对色师傅</th>"
                //拿到当前表格数据与勾选的行做筛选
                let nowRow = table.dataList.filter(function (o) {
                    return (gridOption.value.getSelectedRows().map((o: any) => { return o.id })).indexOf(o["id"]) !== -1;
                })
                let body = "";
                nowRow.forEach(function (o) {
                    body += "<tr><td>" + o["process"] + "</td>";
                    body += "<td>" + o["classTime"] + "</td>";
                    body += "<td>" + o["flowCardCode"] + "</td>";
                    body += "<td>" + o["greyCode"] + "</td>";
                    body += "<td>" + o["productName"] + "</td>";
                    body += "<td>" + o["colorCode"] + "</td>";
                    body += "<td>" + o["colorName"] + "</td>";
                    body += "<td>" + o["canUseHouseNum"] + "</td>";
                    body += "<td>" + o["canUseWeight"] + "</td>";
                    body += "<td>" + o["device"] + "</td>";
                    body += "<td>" + o["workshop"] + "</td>";
                    body += "<td>" + o["finishStaff"] + "</td>";
                    body += "<td>" + o["affirmColourName"] + "</td>";
                    body += "</tr>";
                })
                tableToXlsx(head, '定型加色查询', body)
            } else if (id.value == 4) {
                let idList: any = []
                gridOption.value.getSelectedRows().forEach(function (o: any) {
                    idList.push(o['id'])
                })
                //将表头拼接出来
                let head = "<th>序号</th><th>工序</th><th>日期</th><th>流转卡号</th><th>布号</th><th>品名</th><th>色号</th><th>色称</th><th>匹数</th><th>重量</th><th>责任部门</th><th>回修原因</th><th>班组</th><th>结束员工</th>"
                //拿到当前表格数据与勾选的行做筛选
                let nowRow = table.dataList.filter(function (o) {
                    return (gridOption.value.getSelectedRows().map((o: any) => { return o.id })).indexOf(o["id"]) !== -1;
                })
                let body = "";
                nowRow.forEach(function (o) {
                    body += "<tr><td>" + o["process"] + "</td>";
                    body += "<td>" + o["classTime"] + "</td>";
                    body += "<td>" + o["flowCardCode"] + "</td>";
                    body += "<td>" + o["greyCode"] + "</td>";
                    body += "<td>" + o["productName"] + "</td>";
                    body += "<td>" + o["colorCode"] + "</td>";
                    body += "<td>" + o["colorName"] + "</td>";
                    body += "<td>" + o["canUseHouseNum"] + "</td>";
                    body += "<td>" + o["canUseWeight"] + "</td>";
                    body += "<td>" + o["dutyDep"] + "</td>";
                    body += "<td>" + o["processCause"] + "</td>";
                    body += "<td>" + o["workshop"] + "</td>";
                    body += "<td>" + o["finishStaff"] + "</td>";
                    body += "</tr>";
                })
                tableToXlsx(head, '预缩湿定成品查询', body)
            }
        }
        function tableToXlsx(head: any, filename: any, body: any) {
            const uri = 'data:application/vnd.ms-excel;base64,',
                template = `<html>
            <head><meta charset="UTF-8"></head>
            <body><table border="1"><tr>${head}</tr>${body}</table></body>
        </html>`;
            const a = document.createElement('a');
            a.href = uri + window.btoa(unescape(encodeURIComponent(template)));
            a.download = filename;
            a.click();
            document.removeChild(a);
        }
        return {
            pagingList1,
            localeText1,
            pageData,
            dataForm,
            pagination,
            table,
            headerShow,
            total,
            page,
            size,
            tc,
            tc2,
            tc3,
            tc4,
            defaultColDef,
            gridOption,
            gridOption2,
            gridOption3,
            gridOption4,
            gridReady,
            gridReady2,
            gridReady3,
            gridReady4,
            huiche,
            selectHandler,
            handleChange,
            PageSize,
            change1,
            exports,
            handoff,
        };
    },
    components: { Toolbar, PageTabelLayout,  }
}
</script>
<style scoped lang="less">
// 表格边框线条
:deep(.ag-cell) {
    border-right: 1px solid #dde2eb;
}

:deep(.ag-header-cell) {
    border-right: 1px solid #dde2eb;
}

:deep(.ag-cell-value) {
    user-select: initial;
    -moz-user-select: text;
    -ms-user-select: text;
    -webkit-user-select: text;
}
</style>